<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
  String path = request.getContextPath();
  String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <base href="<%=basePath%>">
  <title>所有用户</title>
  <style type="text/css">
    .outer-box{
      border: 1px solid #5c4591;
      background-color: #eee;
      width: 60%;
      margin: 100px auto;
      height: 500px;

      padding: 50px;
      box-sizing: border-box;
    }
    .table-box{
      background-color: #fff;
      width: 100%;
    }
    .operation{
      border: none;
      display: flex;
    }
    .delete_button{
      text-decoration: none;
      font-weight: bold;
      font-size: 16px;
      color: red;
    }
    .update_button{
      background: transparent;
      font-weight: bold;
      border: none;
      font-size: 15px;
      color:green ;
    }
    .button{
      width: 50px;
      text-align: center;
    }
    .content{
      width: 50%;
      margin: 0 auto;
      display: block;
      text-align: center;
      border: none;
      height: 30px;
      border-bottom: 1px solid #5c4591;
    }
    th{
      padding: 8px;
      background-color: #9a77e8;
      color: #fff;
    }
    td{
      padding: 5px;
    }
    .add{
      padding: 5px ;
      border: 1px solid #5c4591;
      font-size: 17px;
      background-color: #fff;
      text-align: center;
      width: 100px;
      text-decoration: none;
      color: #4f3291;
      margin-bottom: 15px;
      display: block;
      font-weight: bold;
    }
  </style>
</head>

<body>

<div class="outer-box">
  <a class="add" href="addUser.jsp">新增联系人</a>
  <table class="table-box" border="1" cellspacing="0" cellpadding="0" >
    <tr>
      <th>ID</th>
      <th>姓名</th>
      <th>电话</th>
      <th>地址</th>
      <th>操作</th>
    </tr>
    <c:forEach var="U" items="${userAll}"  >
      <form action="UpdateServlet" method="post">
        <tr>
          <td><input class="content" type="text" value="${U.id}" name="id" ></td>
          <td><input class="content" type="text" value="${U.name}" name="name"></td>
          <td><input class="content" type="text" value="${U.number}" name="number"></td>
          <td><input class="content" type="text" value="${U.address}" name="address"></td>
          <td class="operation">
            <div class="button">
              <a @click="alert('删除')" class="delete_button" href="DeleteServlet?id=${U.id}">删除</a>
            </div>
            <div class="button">
              <input class="update_button" type="submit" value="更新"/>
            </div>
          </td>
        </tr>

      </form>
    </c:forEach>

  </table>
</div>

</body>
</html>
